<template>
  <div id="app">
    <tool-bar></tool-bar>
    <site-topbar class="sitetopbar"></site-topbar>
    <site-header class="site-header"></site-header>
    <div class="swiper">
      <left-nav class="leftnav"></left-nav>
      <body-swiper-box class="body-swiper-box"></body-swiper-box>
    </div>
    <body-swiper-sub class="bodyswipersub"></body-swiper-sub>
    <div class="part2">
      <phone-brick-row-box class="phonebrickrowbox"></phone-brick-row-box>
      <bodyBannerBox class="bodybannerbox">
        <a href="#" slot="bodybannerbox"
          ><img src="@/assets/img/picture/body-banner-img.jpg" alt=""
        /></a>
      </bodyBannerBox>
      <video-brick-row-box></video-brick-row-box>
      <footer-bar class="footer"></footer-bar>
      <site-info></site-info>
    </div>
  </div>
</template>

<script>
import SiteTopbar from "@/components/header/site-topbar";
import siteHeader from "@/components/header/site-header";
import phoneBrickRowBox from "@/components/body/phone/phoneBrickRowBox";
import bodyBannerBox from "@/components/body/body-banner-box";
import bodySwiperBox from "@/components/body/body-swiper-box";
import leftNav from "@/components/body/leftNav/leftNav";
import bodySwiperSub from "@/components/body/body-swiper-sub";
import videoBrickRowBox from "@/components/body/video-brick-row-box";
import footerBar from "@/components/footer/footerBar";
import siteInfo from "@/components/footer/siteInfo";
import toolBar from '@/components/body/tool-bar'
export default {
  name: "App",
  components: {
    SiteTopbar,
    siteHeader,
    phoneBrickRowBox,
    bodyBannerBox,
    bodySwiperBox,
    leftNav,
    bodySwiperSub,
    videoBrickRowBox,
    footerBar,
    siteInfo,
    toolBar
  },
};
</script>

<style lang='less'>
@import "./assets/css/reset.css";
@import "./assets/css/leftNavChild.css";
#app {
  .part2 {
    background-color: rgb(245, 245, 245);
  }
  height: 2000px;
  background-color: rgb(255, 255, 255);
  .body-swiper-box {
    margin: 0 auto;
    width: 1226px;
  }
  .swiper {
    position: relative;
    margin: 0 auto;
    width: 1226px;
    .leftnav {
      z-index: 31;
      position: absolute;
    }
  }

  .bodyswipersub {
    margin: 20px auto;
    height: 170px;
    width: 1226px;
  }
  .phonebrickrowbox {
    margin: 0 auto;
    margin-bottom: 22px;
  }
  .bodybannerbox {
    margin: 0 auto;
    img {
      width: 1226px;
    }
  }
  .footer {
    height: 300px;
  }
}
</style>